import MixinVchartTheme from '@/mixins/mixin-vchart-theme'
import { loadCompanyTypeEveryDayData } from '@/api/enterprose'
import { getEnergyUnitName, simpleAutoFill } from '@/utils'

export default {
  mixins: [MixinVchartTheme],
  props: ['title'],
  data () {
    return {
      height: '260px',
      month: this.$dayjs().subtract(1, 'month').format('YYYY-MM'),
      pickerOptions: {
        disabledDate (date) {
          const now = new Date()
          const nowYear = now.getFullYear()
          const nowMonth = now.getMonth()
          const dYear = date.getFullYear()
          const dMonth = date.getMonth()
          return new Date(dYear, dMonth) > new Date(nowYear, nowMonth - 1)
        }
      },
      lists: [],
    }
  },
  computed: {
    enterpriseId () {
      return this.$route.query.enterpriseCode
    },
    chartOption () {
      const daysInMonth = this.$dayjs(this.month).daysInMonth()
      const unit = getEnergyUnitName(this.type)
      const lists = this.lists
      return {
        tooltip: {
          trigger: 'axis',
          axisPointer: {
            type: 'cross'
          },
          valueFormatter: value => `${value} ${unit}`
        },
        xAxis: {
          type: 'category',
          data: Array(daysInMonth).fill(1).map((v, i) => `${i + 1}日`)
        },
        yAxis: {
          type: 'value',
          name: unit,
        },
        series: [
          {
            type: 'line',
            name: this.title,
            itemStyle: {
              color: this.color,
            },
            smooth: true,
            data: simpleAutoFill(daysInMonth, lists),
          }
        ]
      }
    }
  },
  watch: {
    month () {
      this.loadList()
    },
    enterpriseId () {
      this.loadList()
    },
  },
  mounted () {
    this.loadList()
  },
  methods: {
    loadList () {
      const tenantId = this.enterpriseId
      const type = this.type
      const dataTime = this.month
      if (tenantId && type) {
        loadCompanyTypeEveryDayData(tenantId, type, dataTime).then(res => {
          if (res.code === 200) {
            this.lists = res.data || []
          }
        })
      }
    },
  }
}
